<template>
  <div class="box">
    <el-breadcrumb separator=">">
      <el-breadcrumb-item :to="{ path: '/login'}" replace>首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/login/shop'}" replace>商户管理</el-breadcrumb-item>
      <el-breadcrumb-item>商户认证申请</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="tableBox">
      <div class="tableTitle">商户认证申请</div>
      <el-table :data="tableData">
        <el-table-column type="index" label="序号" align="center" width="60"></el-table-column>
        <el-table-column prop="shopId" label="商家编号" align="center"></el-table-column>
        <el-table-column prop="shopId" label="商家账号" align="center"></el-table-column>
        <el-table-column prop="shopId" label="商家名称" align="center"></el-table-column>
        <el-table-column prop="shopId" label="注册时间" align="center"></el-table-column>
        <el-table-column label="商家详情" align="center">
          <template slot-scope="data">
            <router-link :to="{path: 'shop/shopInfo', query: {shopId: data.row.shopId}}">查看</router-link>
          </template>
        </el-table-column>
        <el-table-column label="商家银行卡详情" align="center">
          <template slot-scope="data">
            <router-link :to="{path: 'shop/shopBankCardInfo', query: {shopId: data.row.shopId}}">商家银行卡详情</router-link>
          </template>
        </el-table-column>
        <el-table-column prop="shopId" label="商户分类" align="center"></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="data">
            <span class="colors" @click="examinationPassed(data.row)">通过</span>
            /
            <span @click="auditRejection(data.row)">拒绝</span>
          </template>
        </el-table-column>
      </el-table>
      <pagination @handleSize="handleSizeChange" @handleCurrent="handleCurrentChange" :maxTotal="maxTotal"></pagination>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  import pagination from 'components/pagination'

  export default {
    data () {
      return {
        tableData: [],
        maxTotal: 20
      }
    },
    created () {
    },
    methods: {
      examinationPassed (item) {
      },
      auditRejection (item) {
        this.$prompt('', '拒绝原因', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          inputPlaceholder: '不得超过20个字',
          inputPattern: /[\u4e00-\u9fa5]+/,
          inputValidator (value) {
            if (value.length > 20) {
              return '不得超过20个字'
            }
            return true
          },
          inputErrorMessage: '请输入文字拒绝原因'
        }).then(({value}) => {
          this.$message({
            type: 'success',
            message: '你的邮箱是: ' + value,
            center: true
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入',
            center: true
          })
        })
      },
      handleSizeChange (val) {
      },
      handleCurrentChange (val) {
      }
    },
    components: {
      pagination
    }
  }
</script>

<style lang="less" ref="stylesheet/less" scoped>
</style>
